


/*事件冒泡：获得 + ，- */
document.querySelector(" .pro-list").onclick = function (event){
    var ele = event.target;

    console.log("点击的元素是：" + ele.nodeName);
    console.log("点击的元素是：" + ele.type);

    if(ele.nodeName=='BUTTON' && ele.innerText=='+' ){ // + button
        // 商品数量
        var count = ele.previousElementSibling.value;
        console.log("当前商品个数：" + count);
        if(count <5)
        ele.previousElementSibling.value = ++count;

        //商品单价
        var unitPrice = ele.parentElement.previousElementSibling.lastElementChild.innerText;
        console.log("当前商品单价：" + unitPrice);

        //小计价格
        var xiaoji = count * unitPrice; // JS 小数点保留1位
        ele.parentElement.nextElementSibling.lastElementChild.innerText = xiaoji;

        totalSelectedCount(); // 统计已选中的商品总数量
        totaPrice();


    }else if(ele.nodeName=='BUTTON' && ele.innerText=='-'){// - button
        var count = ele.nextElementSibling.value;
        console.log("商品数量:" + count);
        if(count >1)
            ele.nextElementSibling.value = --count;

        //商品单价
        var unitPrice = ele.parentElement.previousElementSibling.lastElementChild.innerText;
        console.log("商品单价:" + unitPrice);
        //小计价格
        var xiaoji =count * unitPrice;
        ele.parentElement.nextElementSibling.lastElementChild.innerText = xiaoji;

        totalSelectedCount();  // 统计已选中的商品总数量
        totaPrice();


    }else if(ele.nodeName=='INPUT' && ele.type =='checkbox'){
        totalSelectedCount();  // 统计已选中的商品总数量
        totaPrice();
    }


}


// 点击第一个上面的全选按钮
var firstSelectAllCheckboxELe = document.querySelector(".head-checkbox").firstElementChild;
firstSelectAllCheckboxELe.onclick = function (){
    selectAll(this);
}

// 点击第二个下面的全选按钮
var secondSelectAllCheckboxELe = document.querySelector(".jiesuan-left").firstElementChild;
secondSelectAllCheckboxELe.onclick =  function (){
    selectAll(this);
}

//全选、全不选的实现
 function selectAll(ele){
    var isSelectAll = ele.checked;
    console.log("全选按钮的状态：" + isSelectAll);

    var proCheckboxArr = document.querySelectorAll(".goods-left input");
    for(var i =0;i<proCheckboxArr.length;i++){
        proCheckboxArr[i].checked = isSelectAll;
    }

    totalSelectedCount();
    totaPrice();
}

// 已选中的商品的总数量
function totalSelectedCount(){
    var sumCount = 0;

    //获得所有商品前面的checkbox状态
    var proCheckboxArr = document.querySelectorAll(".goods-left input");
    console.log("proCheckboxArr="+proCheckboxArr.length);
    for(var i =0;i<proCheckboxArr.length;i++){
        if(proCheckboxArr[i].checked ){


            console.log()
            // checkbox状态 == true,获得他们对应的数量
           var cartQualityEle =  proCheckboxArr[i].parentElement.nextElementSibling.children[1];
           var count =  parseInt(cartQualityEle.children[1].value);
            sumCount+=count;
            console.log("总数量是：" + sumCount );


        }
    }
    document.querySelector(".selected-count .number").innerText = sumCount;

}

//总价格统计
function totaPrice(){
    var totalPrice = 0;

    //获得所有商品前面的checkbox状态
    var proCheckboxArr = document.querySelectorAll(".goods-left input");
    for(var i =0;i<proCheckboxArr.length;i++) {
        if (proCheckboxArr[i].checked) {
            // 获得每个checkbox状态已选中的商品的小计
            var cartXiaojiEle =  proCheckboxArr[i].parentElement.nextElementSibling.children[2];
            var xiaoji = parseFloat( cartXiaojiEle.lastElementChild.innerText);
            // 小计 累加---
            totalPrice+= xiaoji;
            console.log(totalPrice);
        }
    }

    //  商品总价格innerText
    document.querySelector(".zongjia").lastElementChild.innerText = totalPrice;

}

// 在HTML doc 文档加载完整之后，就要统计 总数量、总价格
totalSelectedCount();
totaPrice();
